<template>
        <div class="active" v-if="showCom">
                <slot name="left" :item="item">
                        <input type="text">
                        <input type="text">
                        <input type="text">
                        <button>修改</button>
                </slot>
                <button @click="quxiao">取消</button>
        </div>
</template>
<script>
export default {
        props: {
                showCom: {
                        typeof: Boolean
                }
        },
        data() {
                return {

                }
        },
        created() {
        },
        computed: {
        },
        methods: {
                quxiao() {
                        this.$emit('update:showCom', false)
                }
        }
}
</script>
<style lang='less'  scoped>
.active {
        width: 500px;
        height: 300px;
        background: rgba(0, 0, 0, .5);
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        flex-direction: column;

        input {
                width: 200px;
                height: 30px;
                margin-bottom: 5px
        }

        button {
                width: 100px;
                height: 30px;
        }
}
</style>
